<template>
	<view class="details-centers">
		<!--
		<view class="top-input" v-show="shows==1" catchtouchmove>
			<view class="top-title">磁力保存</view>
			<view class="top-item">
				<input placeholder="请确认关键字" v-model="name" class="input" />
			</view>
			<view class="top-item">
				<input placeholder="请确认磁力链接" v-model="text" class="input" />
			</view>
		    <view class="submits" @click="saveSql()">确认添加</view>
		</view>
		<view  class="moban" v-show="shows==1" :style="{height:height+'px'}"></view>-->
		
		<view class="top-centers">
			<web-view :src="url" :webview-styles="webviewStyles" ref="webviews"></web-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				height:'',
				text:'',
				url:'',
				shows:2,
				name:'',
				webviewStyles: {
				   color: '#333', 
				   zIndex:'1'
				}
			  }
			},
			onLoad(option) {
				let self=this
				if(option.text){
					self.name=option.text
					self.url=option.url+self.name
					self.opendata()
				}
				uni.getSystemInfo({
					success: function(res) {
						self.height = res.windowHeight
					  }
				});
			},
			mounted() {
			    this.timer = setInterval(this.get, 1000);
			},
			beforeDestroy () {
			    clearInterval(this.timer);
			},
			destroyed () {
				plus.sqlite.closeDatabase({
						name: 'first',
						success: function(e){
							console.log('closeDatabase success!');
						},
						fail: function(e){
							console.log('closeDatabase failed: '+JSON.stringify(e));
						}
				 });	
			},
			methods:{
				opendata(){
					 plus.sqlite.openDatabase({
						name: 'first',
						path: '_doc/test.db',
						success: function(e){
							console.log('openDatabase success!');
						},
						fail: function(e){
							console.log('openDatabase failed: '+JSON.stringify(e));
						}
					});
				},
				saveSql(){
					let self=this
					if(!self.text){
						uni.showToast({
							title: '请确认磁力链接',
							icon: 'none',
							duration: 2000
						});
						return
					}
					if(!self.name){
						uni.showToast({
							title: '请输入名称',
							icon: 'none',
							duration: 2000
						});
						return
					}
					let time=new Date().getTime()
					plus.sqlite.executeSql({
						name: 'first',
						sql: "insert into database values('"+self.name+"','"+self.text+"','"+time+"','"+time+"')",
						success: function(e){
							console.log('executeSql success!');
							uni.showToast({
								title: '保存成功',
								icon: 'none',
								duration: 2000
							});
						},
						fail: function(e){
							console.log('executeSql failed: '+JSON.stringify(e));
							uni.showToast({
								title: '保存失败',
								icon: 'none',
								duration: 2000
							});
						}
					});
					//self.shows=2
					self.timer = setInterval(self.get, 1000);
				},
				get() {
					let self=this
					uni.getClipboardData({
					    success: function (res) {
						    self.text=res.data
							if(uni.getStorageSync("text")){
								let text=uni.getStorageSync("text")
								if(self.text!=text){
									//uni.removeStorageSync("text")
									uni.setStorageSync("text",self.text)	
									uni.setStorageSync("newtext",self.text)	
									clearInterval(self.timer)
									setTimeout(function(){
										uni.navigateTo({
											url: '/pages/index/btdata?text='+self.name
										});
									}, 1000);
								}
							}else{
								uni.setStorageSync("text",self.text)
								clearInterval(self.timer)
								uni.setStorageSync("newtext",self.text)
								setTimeout(function(){
									uni.navigateTo({
										url: '/pages/index/btdata?text='+self.name
									});
								}, 1000);
							}
					    }
					});
				},
			}
		}
</script>

<style lang="scss">
	page{
		background-color: #f9f9f9;
	}
	
	.details-centers{
		width: 100%;
		overflow: hidden;
		margin: 0rpx auto;
		.moban{
			position: fixed;
			width: 100%;
			height: 100%;
			z-index: 99;
			background:rgba(0, 0, 0, 0.5);
		}
		.top-input{
			position: fixed;
			top: 20%;
			left: 10%;
			width: 80%;
			overflow: hidden;
			line-height: 188rpx;
			z-index: 100;
			background: #FFFFFF;
			border-radius: 20rpx;
			box-shadow: 0px 0px 5px #E3E3E3;
			.top-title{
				width: 100%;
				overflow: hidden;
				line-height: 66rpx;
				text-align: center;
				margin: 20rpx auto;
			}
			.top-item{
				width: 100%;
				overflow: hidden;
				line-height: 66rpx;
				text-align: center;
				margin: 20rpx auto;
				.input{
					width: 95%;
					overflow: hidden;
					height: 66rpx;
					color: #333333;
					margin: 0rpx auto;
					border: 2rpx solid #333333;
					border-radius: 20rpx;
					padding-left: 20rpx;
				}
			}
			.submits{
				width: 90%;
				overflow: hidden;
				margin: 20rpx auto;
				line-height: 66rpx;
				text-align: center;
				font-size: 28rpx;
				background: #FF4b56;
				color: #FFFFFF;
				border-radius: 20rpx;
			}
		}
		.top-centers{
			width: 90%;
			overflow: hidden;
			margin: 10rpx auto;
			.inputs{
				width: 100%;
				line-height: 66rpx;
				height: 66rpx;
				border: 1rpx solid #333;
				border-radius: 20rpx;
			}
		}
	}
</style>